<!--
 * @Author: Wangtao
 * @Date: 2020-09-21 09:55:09
 * @LastEditors: Wangtao
 * @LastEditTime: 2021-01-27 14:29:04
-->
<template>
  <div class='drawer-container'>
    <div>
      <slot name="prompt"></slot>
    </div>
    <div class="content">
      <slot name="content"></slot>
    </div>
    <div class="oprate">
      <div>
        <slot name="remove"></slot>
      </div>
      <div>
        <slot name="oprate"></slot>
      </div>
    </div>
  </div>
</template>

<script lang="ts">
import { Component, Vue } from 'vue-property-decorator'
@Component({
  name: 'DrawerContainer',
  components: {}
})

export default class DrawerContainer extends Vue {

}
</script>

<style lang="stylus" scoped>
.drawer-container
  height 100%
  display flex
  flex-direction column
  justify-content space-between
  box-sizing border-box
  .content
    padding 24px 18px 24px 24px
    height calc(100% - 50px)
    overflow scroll
    box-sizing border-box
  .oprate
    display flex
    justify-content space-between
    padding 0 24px 15px
  >>> .el-select
    width 100%
  >>> .select-group
    display flex
  >>> .select-box
    margin-right 10px
  >>> .select-box
    width 50%
</style>
